<!DOCTYPE html>
<head>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>
</head>
<body>
    <style>
        .area{
            width:400px;
            height:200px;
            border:1px solid black;
            text-align: center;
            line-height: 200px;
            font-size: 20px;
        }
    </style>
    
    <div id="app"> 
       <div class="area" @mousemove="position">
           {{x}},{{y}}
       </div>
    </div>
    <script>    
    new Vue({
       el:'#app',
       data:{
           x:0,
           y:0
       },
       methods:{
           position:function(event){
               console.log(event)
               this.x=event.offsetX;
               this.y=event.offsetY;
           }
       }
    })
</script>
</body>

</html>
